/***
 * 漫画原创鼠标悬浮气泡提示Jquery插件
 * 编写时间：2012年11月14号
 * version:manhua_hoverTips.js
***/
$(function() {
	$.fn.tooltip = function(userOptions) {
		function style($btip,$this,options){
			offset = $this.offset();
			h = $this.height();
			w = $this.width();
			
			switch(options.position){
				case "t" ://当它是上面的时候
					$btip.css({ "left":offset.left ,  "top":offset.top+h+14  }).show();
					$btip.find(".triangle-t").css('left',w/2-$btip.find(".triangle-t").width()/2);
					$btip.find(".triangle-t").css('top',-($btip.find(".triangle-t").height()));
					break;
				case "b" ://当它是下面的时候
					$btip.css({ "left":offset.left ,  "top":offset.top-$btip.height()-$btip.find(".triangle-b").height()}).show();
					$btip.find(".triangle-b").css('left',w/2-$btip.find(".triangle-b").width()/2);
					$btip.find(".triangle-b").css('bottom',-($btip.find(".triangle-b").height()));
					break;
				case "l" ://当它是左边的时候
					$btip.css({ "left":offset.left+w+$btip.find(".triangle-l").width()*2,"top":offset.top+h/2-$btip.height()/2}).show();
					$btip.find(".triangle-l").css('top',$btip.height()/2-$btip.find(".triangle-l").height()/2);
					$btip.find(".triangle-l").css('left',-$btip.find(".triangle-l").width());
					break;
				case "r" ://当它是右边的时候
					$btip.css({ "left":offset.left-$btip.width()-$btip.find(".triangle-r").width()*2,"top":offset.top+h/2-$btip.height()/2}).show();
					$btip.find(".triangle-r").css('top',$btip.height()/2-$btip.find(".triangle-r").height()/2);
					$btip.find(".triangle-r").css('left',$btip.width());
					break;
			}
		}
		return this.each(function(){
			var defaults = {					
				position : "t",			//箭头指向上(t)、箭头指向下(b)、箭头指向左(l)、箭头指向右(r)
				value : 23	//小箭头偏离左边和上边的位置			
			};
			var options = $.extend(defaults,userOptions);	
			t = setTimeout(function(){return true;},10);
			var $this = $(this);
			if(typeof $btip == "undefined"){
				var bid = parseInt(Math.random()*100000);
				var html = '<div class="docBubble" id="btip'+bid+'">';
				html+='<i class="triangle-'+options.position+'"></i>';
				html+='<div class="tl"><div class="cont"></div></div>';
				html+='</div>';
				$("body").append(html);
				$btip = $("#btip"+bid);
			}
			$this.mouseenter(function(){
					clearTimeout(t);
					t = setTimeout(function (){
						$btip.hide();
						var offset,h ,w ;
						if(options.html){
							$btip.find(".cont").html(options.html);
							style($btip,$this,options);
						}else if(options.url){
							$btip.find(".cont").html("加载中。。");
							style($btip,$this,options);
							$.get(options.url,function(resp){
								$btip.find(".cont").html(resp);
								style($btip,$this,options);
							});
						}
					},300);
			});
			$this.mouseleave(function(){
					clearTimeout(t);
					t = setTimeout(function (){
							$btip.hide();
					}, 1000);
			});
			
			$btip.mouseenter(function(){
					clearTimeout(t);
					$btip.show();
			});
			$btip.mouseleave(function(){
					$btip.hide();
			});
		});
	};
});